import React from 'react';
import Spin from '../Spinner/spin.js'
import './null.less';
import nocar from "../../images/nocar.png"
import nobuild from "../../images/nobuild.png"
import nocontent from "../../images/nocontent.png"
import nojoin from "../../images/nojoin.png"
import loading from "../../images/loading.gif"

class Null extends React.Component {
    constructor(props) {
        super(props);
        this.displayName = 'Null';
        this.state = {
            loaded:false
        }
        this.timer
    }
    componentDidMount(){
        this.timer = setTimeout(()=>{
            this.setState({
                loaded:true
            })
        },10000)
    }
    componentWillUnmount(){
        clearTimeout(this.timer)
    }
    render() {
        var type = this.props.type
        var text = this.props.text
        var content
        if(type=="nocar"){
            content=nocar
        }else if(type=="nobuild"){
            content=nobuild
        }else if(type=="nojoin"){
            content=nojoin
        }else{
            content=nocontent
        }
        return <div className="tederen-null">{
            this.state.loaded?<div className="null-container">
                <div className="null-img"><img src={content}/></div>
                <div className="null-text">{this.props.text}</div>
            </div>:<div className="loading">
                {/*<img src={loading}/>*/}
                <Spin type={4}/>
            </div>
        }</div>
    }
}

export default Null
